Le but de ce chapitre est de présenter les cartes dans d3 ainsi que leur format de données, le GeoJSON.

Ce troisième exercice propose une extension de D3 pour pouvoir réaliser une carte du monde à l'échelle des pays : DataMaps.js. (GitHub du projet).
Cette bibliothèque utilise D3.js et TopoJSON (TopoJSON est une compression du format GeoJSON), ce qui permet de très facilement créer des visualisations pour tous les pays du monde.
De plus le GitHub du projet propose des cartes des pays avec leurs Provinces/États/Régions à cette adresse (Attention: cette librairie n'est encore qu'à la version D3 v3, mais elle est en état de mise à jour vers la notation D3 v4, la même que D3 v5).

Il vous est demandé de faire le travail suivant :

  1. Créer avec d3 une fenêtre div de largeur 1000 pixels et de hauteur 700 pixels. Indiquer également une position relative à cette fenêtre.
  2. Créer une nouvelle Datamap dans la div nouvellement créée et utiliser la projection de Mercator.
  3. Désactiver le changement de couleur lorsque la souris passe sur un pays (le hoover).
  4. Utiliser les différentes options dans DataMaps pour colorier en rouge les 3 pays membres de l'ALENA et en bleu 10 pays de l'Union Européenne.